{yun:}include file="$wapstyle/member/lheader.htm"{/yun}
<link rel="stylesheet" type="text/css" href="{yun:}$wap_style{/yun}/js/webapppic/cropper.css?v={yun:}$config.cachecode{/yun}" />
<script src="{yun:}$wap_style{/yun}/js/webapppic/cropper.js?v={yun:}$config.cachecode{/yun}" language="javascript"></script>

<script>
    $(function() {

        function toFixed2(num) {
            return parseFloat(+num.toFixed(2));
        }

        $('#cancleBtn').on('click', function() {
            $("#showEdit").fadeOut();
            $('#showResult').fadeIn();
        });
		$('#rotateBtn').on('click', function() {
            $('#readyimg').cropper('rotate',90);
        });
        $('#confirmBtn').on('click', function() {
            $("#showEdit").fadeOut();

            var $image = $('#report > img');
            var dataURL = $image.cropper("getCroppedCanvas");
            var imgurl = dataURL.toDataURL("image/jpeg", 0.5);
            $("#changeAvatar > img").attr("src", imgurl);
            $("#uimage").val(imgurl);
            $('#showResult').fadeIn();

        });

        function cutImg() {
            $('#showResult').fadeOut();
            $("#showEdit").fadeIn();
        }

        $('#image').on('change', function() {
            cutImg();
        });

        var $image = $('#report > img');

        options = {
            modal: true,
            autoCropArea: 0.5,
            dragCrop: false,
            movable: true,
            resizable: false,
            minContainerWidth: 400,
            minContainerHeight: 400,
            aspectRatio: 1 / 1,
            crop: function(data) {

            }
        };

        $image.on().cropper(options);

        var $inputImage = $('#image'),
            URL = window.URL || window.webkitURL,
            blobURL;
        if(URL) {
            $inputImage.change(function() {
                var files = this.files,
                    file;

                if(files && files.length) {
                    file = files[0];

                    if(/^image\/\w+$/.test(file.type)) {
                        blobURL = URL.createObjectURL(file);

                        $image.one('built.cropper', function() {
                            URL.revokeObjectURL(blobURL); 
                        }).cropper('reset', true).cropper('replace', blobURL);

                        $inputImage.val('');
                    } else {
                        showMessage('请上传图片');
                    }
                }
            });
        } else {
            $inputImage.parent().remove();
        }

    });

    function photo() {
        var uimage = $("#uimage").val();
        var regS = new RegExp("\\+", "gi");
        if(uimage == '') {
            layermsg('头像未改变，无需修改');
            return false;
        }else{
			uimage = uimage.replace(regS, "#");
			$.ajax({
				type: 'POST',
				url: "index.php?c=uppic",
				cache: false,
				dataType: 'json',
				data: {
					uimage: uimage,
					submit: 1
				},
				success: function(msg) {
					if(msg == '1') {
						var date = '上传成功！';
					} else {
						var date = '上传失败！';
					}
					layermsg(date, 2, function() {
						window.location.href = wapurl + "member/index.php";
					});
					return false;
				}
			});
		}
        
    }
</script>
<section class="resume_mangage">
    <div class="clear"></div>
    <div class="verify">
        <div class="photo_i_box_v" style="background:#fff">
            <div id="showResult">
                <div id="changeAvatar" class="photo_i_box">
                    <img src="{yun:}$row.photo_big{/yun}" width="120" height="120">
                </div>
                <div class="clear"></div>
                <div class="photo_xz">
                    <input id="image" type="file" accept="image/*" />选择上传头像
                </div>
                <div class="clear"></div>

                <div class="yunset_identity_msg"><i class="yunset_identity_msg_icon"></i>选择上传头像点击提交按钮即可上传</div>
            </div>
            <div id="showEdit" style="display: none;width:100%;height: 100%;position: absolute;top:0;left: 0;z-index: 9;">
                <div class="photo_cz_bth">
                    <button class="mui-btn" data-mui-style="fab" id='cancleBtn' style="margin-left: 10px;">取消</button>
                    <button class="mui-btn" data-mui-style="fab" id='rotateBtn'>旋转</button>
                    <div class="photo_cz_bth_qd">
                        <button class="mui-btn" data-mui-style="fab" data-mui-color="primary" id='confirmBtn'>确定</button>
                    </div>
                </div>
                <div id="report">
                    <img src="" alt="Picture" id="readyimg">
                </div>
            </div>
            <div class="photo_tj">
                <input type='hidden' name="txt" id="uimage" value="">
                <input name="submit" type="button" onclick="photo()" value="保存/修改" class="yunset_bth" />
            </div>
        </div>
    </div>
</section>
</div>
<div class="clear"></div>
{yun:}include file="$wapstyle/footer.htm"{/yun}